Thank you for purchasing our product. If you have any questions that are beyond the scope of this help file, please feel free to email via my user page contact form here. Thanks so much!
ListingGEO - Directory Listing Template: Is a Responsive Multi-Concept listing and directory template. This is specially design for any kind of directory or listing related site. It can be also used for any kind of chainshop websites.
ListingGEO is Responsive, Retina ready & Multi-Device supported. It is built with Bootstrap Framework, HTML5, CSS3 with SASS. All code is beautifully written which is easy to customize. Code is W3C validated.
This Documentation provide you a clear guideline for how to use and customize template. If you facing any problem, please don't forget to ask any question or contact with us for support. Thank You for Purchasing our Product.
ListingGEO has lot of features and functionality:
All the HTML codes and section are well seprated by linespace and comments so that you can modify and copy easily. As example here below is the sample codes for how it work section:
<div class="working-process-section">
<div class="overlay"></div>
<div class="container">
<div class="section-title">
<h2>How it Works</h2>
<p>Expose your business to your community and others in a right way.</p>
</div>
<div class="row">
<div class="col-lg-4 col-md-6">
<div class="working-process-block">
<span class="ti-user"></span>
<h4>Signup</h4>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et
</p>
</div>
</div>
<div class="col-lg-4 col-md-6">
<div class="working-process-block">
<span class="ti-pencil-alt"></span>
<h4>Add/Review Listing</h4>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et
</p>
</div>
</div>
<div class="col-lg-4 col-md-6">
<div class="working-process-block">
<span class="ti-stats-up"></span>
<h4>Grow Your Business</h4>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et
</p>
</div>
</div>
</div>
</div>
</div>
You just need to copy one of them, which one you needed for your site to build.
Our styles files are seperated on css folders on the assets folder having all the external CSS plugins and template css like
And our template have 2 custom CSS files name style.css and responsive.css.
Also our main css file and responsive css file are the generated result from sass. We have a sass folder on where we have made separate scss file for each and every different element of the template so that you can easily find and replace style which make change dynamically. So, if you have sass setup on your pc then just change style on regarding scss file and regenerate it to our main style.css file on css folder
style.css files codelines are decorated on such level:
/* |---------------------------------------------------------------------------- | CSS INDEX |---------------------------------------------------------------------------- 1. General Style 2. Main header Style 3. Main Banner Style 4. Breadcrumb Style 5. About Style 6. Blog Style 7. Team Style 8. Listing Catagory Style 9. Popular Cities Style 10. Working Process Style 11. Single Style 12. Widgets Style 13. Testimonial Style 14. Call to action Style 15. Working Map Style 16. Pricing Style 17. Form Style 18. Map Style 19. Listing Map Style 20. Add listing Style 21. Pagination Style 22. Contact Style 23. Footer Style */
If you want to change the style of Breadcrumb and you are not familiar with sass than simply go to Breadcrumb Styles section and change the styles as your want:
/*
|----------------------------------------------------------------------------
| 4. Breadcrumb Style
|----------------------------------------------------------------------------
*/
.subheader {
padding: 270px 0 180px 0;
position: relative;
text-align: center;
background: url(../images/background/2.jpg) center center no-repeat;
}
.subheader h2 {
line-height: 45px;
font-weight: 700;
margin-bottom: 0;
color: #fff;
position: relative;
z-index: 999;
}
.subheader-two {
padding: 130px 0 30px 0;
background: url(../images/background/4.jpg) center center no-repeat;
}
.breadcrumb-block {
padding: 20px 0;
-webkit-box-shadow: 0px 4px 7px -1px rgba(216, 216, 216, 0.75);
box-shadow: 0px 4px 7px -1px rgba(216, 216, 216, 0.75);
}
.breadcrumb-block .breadcrumb {
margin-bottom: 0;
display: inline-block;
width: 49%;
padding: 0;
background: transparent;
vertical-align: middle;
}
.breadcrumb-item.active {
color: #111;
}
.breadcrumb-item + .breadcrumb-item::before {
font-family: 'FontAwesome';
content: "\f178";
color: #111;
}
.breadcrumb-call-to-action {
width: 50%;
text-align: right;
display: inline-block;
}
.breadcrumb-call-to-action p {
margin-bottom: 0;
margin-right: 25px;
display: inline-block;
}
This template has following javascript plugins:
all these files are located on assets/js folder. Our custom.js, mapdata.json and map.js located on the js folder on root directory.
Like CSS and HTML our JavaScript codes on our custom.js file are also well organized and well commented.
For example if you want to change the functionality of magnific popup just find the following block of codes and change it according to your need:
/*-----------------------------------------------------------
Magnific-Popup settings
--------------------------------------------------------------*/
$('.play-btn').magnificPopup({
type: 'iframe'
});
$.extend(true, $.magnificPopup.defaults, {
iframe: {
patterns: {
youtube: {
index: 'youtube.com/',
id: 'v=',
src: 'http://www.youtube.com/embed/%id%?autoplay=1'
}
}
}
});
We followed the standard technique and latest PHP coding structure.
PHP File included:
In sendmail.php 1st step is to change our mail address with your own email address so that you can get mail from contact form. Find the line and give your email address:
// Email will be send $to = "codepassenger@gmail.com"; // Change with your email
Replace the codepassenger@gmail.com to your receiver email address.
Version 1.1 - 27.02.2018 ==== Fixed: Browser compatibility Fixed: Input range issue fix in Mozilla Update: Responsive Improved Fixed: Grid view, List view issue fix Version 1.0 - 22.10.2017 ==== Initial Release
We are thankful to...
Once again, thank you so much for purchasing this product. As we said at the beginning, We'd be glad to help you if you have any questions relating to this product. No guarantees, but we'll do our best to assist. If you have a more general question relating to this product on ThemeForest, you might consider visiting the forums and asking your question in the "Item Discussion" section.
CodePassenger Team